<template>
  <TitleCard :title="cardTitle" :showMore="showMore">
    <component :is="pageComponent"></component>
  </TitleCard>
</template>

<script>
import mixinsBackStack from '@/views/backstageSupport/mixins'
import Edit from './edit.vue'
import Issue from './issue.vue'
import Detail from './detail.vue'

export default {
  mixins: [mixinsBackStack],
  data() {
    return {
      pageComponent: 'Detail',
      cardTitle: '发布政策',
    }
  },
  components: {
    Edit,
    Issue,
    Detail
  },
  watch: {
    '$route.query': {
      handler() {
        this.switchComponent()
      },
      deep: true,
      immediate: true
    },
  },
  methods: {
    initTitleCard(name) {
      this.titleCard = name
    },
    // 组件切换
    switchComponent() {
      const { type } = this.$route.query
      switch (type) {
        case 'detail':
          this.pageComponent = 'Detail'
          this.cardTitle = '政策详情'
          break;
        case 'edit':
          this.pageComponent = 'Edit'
          this.cardTitle = '编辑政策'
          break;
        default:
          this.pageComponent = 'Issue'
          this.cardTitle = '发布政策'
          break;
      }
    }
  }
}
</script>
